<template>
	<!-- 弹幕 -->
	<view class="position-fixed left-0  right-0" style="bottom: 120rpx;height: 350rpx;width: 520rpx;">
		<scroll-view :scroll-into-view="scrollIntoView" scroll-y="true" scroll-with-animation class="px-2" style="width: 520rpx;height: 300rpx;">
			<view :id="'danmu'+item.id" v-for="(item,index) in list" :key='item.id' class="flex mb-2 justify-start align-start p-2 rounded" style="background-color: rgba(255,255,255,0.2);">
				<text class="text-danger font-md">昵称：{{item.name}}</text>
				<text class="text-white font-md">{{item.content}}</text>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default{
		data() {
			return {
				scrollIntoView:'',
				list:[]
			}
		},
		methods:{
			send(data){
				this.list.push(data)
				this.toBottom()
			},
			toBottom(){
				let len=this.list.length-1
				if(len>0&&this.list[len].id){
					setTimeout(()=>{
						this.scrollIntoView='danmu'+this.list[len].id
					},300)
				}
			}
		}
	}
</script>

<style>
</style>
